<template>
	<view id="app" >
		<!-- 推销成果 -->
		<view class="topBg df dfsa ais ptb50 plr30 cff9231">
			<view class="bar tac" @click="changeShow(1)">
				<view class="txt f48 fwb">￥{{wrap.one}}</view>
				<view class="txt mt20">已完成返佣总额</view>
			</view>
			<view class="line bdr1s"></view>
			<view class="bar tac" @click="changeShow(2)">
				<view class="txt f48 fwb">￥{{wrap.two}}</view>
				<view class="txt mt20">已付款返佣总额</view>
			</view>
		</view>

		<!-- 订单 -->
		<view class="orderArea">

			<!-- 暂无商品 -->
			<view class="none df dfc aic ptb70 bw" :class="{'opcity': list.length != 0}" v-if="list.length == 0">
				<view class="img wh400">
					<image src="/static/none.png" mode="aspectFit"></image>
				</view>
				<view class="txt cccc f30">暂无数据</view>
			</view>

			<!-- 区 -->
			<view class="wrap mlr30">

				<view class="area mt30 pt10 plr20" v-for="(item,index) in list" :key="index">
					<!-- 订单信息 -->
					<view class="rows ptb20 c333 f26 bdb1se">
						<view class="col">订单号：{{item.number}}</view>
						<view class="col">{{item.status_text}}</view>
					</view>
					<!-- 商品信息 -->
					<view class="proInfo df mt20 p20 bfff7ef br10">
						<!-- 图片商品 -->
						<view class="proImg wh50">
							<image :src="item.sellData.shop_logo" mode="scaleToFill"></image>
						</view>
						<!-- 内容 -->
						<view class="info oh f1 ml20">
							<!-- 标题 -->
							<view class="title c333 f30">{{item.sellData.shop_name}}</view>
							<!-- 内容 -->
							<view class="name mt20 c666 f30 t2hd">{{item.goodsData.name}}</view>
							<!-- 价格 -->
							<view class="price mt20 cffa351 f30">￥{{item.goodsData.price}}</view>
						</view>
					</view>
					<!-- 用户 -->
					<view class="user df aic ptb30">
						<!-- 头像 -->
						<view class="avatar wh50">
							<image :src="item.userData.avatar" mode="aspectFill"></image>
						</view>
						<!-- 内容 -->
						<view class="info ml15">
							<!-- 用户名 -->
							<view class="name c666 f26">{{item.userData.nickname}}</view>
							<!-- 订单时间 -->
							<view class="time mt5 c999 f26">订单时间：{{item.createtime}}</view>
						</view>
					</view>
				</view>
			</view>

		</view>

		<view class="fill"></view>
	</view>
</template>
<script>
	// 定义全局变量that
	var that;
	export default {
		// 页面变量
		data() {
			return {
				// 可以显示
				current: 0,
				// 内容
				wrap: {
					one: '加载中...',
					two: '加载中...',
				},
				// 列表
				list: {},
				//  
			}
		},

		// 页面加载完成后
		onLoad() {
			that = this;

			// 获取个人信息
			that.getUserinfo();

			// 获取内容
			that.getWrap();
		},
		onShow() {
		
		},

		// 页面下拉
		onPullDownRefresh() {
			// 获取个人信息
			that.getUserinfo();

			// 重置下标
			that.current = 0;

			// 获取内容
			that.getWrap();
		},

		// 方法集
		methods: {
			// openMsg() {
			// 	wx.requestSubscribeMessage({ // 调起消息订阅界面
			// 		tmplIds: [
			// 			'dNvjJOkcLYsmM2KXDTwYsoU7WVIxu6efNzyjzZmSyf4',
				
			// 		],
			// 		success(res) {
			// 			console.log('订阅消息 成功 ');
			// 			console.log(res);
			// 		},
			// 		fail(er) {
			// 			console.log("订阅消息 失败 ");
			// 			console.log(er);
			// 		}
			// 	})

			// },
			// 获取个人信息
			getUserinfo() {
				that.util.getuserinfo((rs) => {
					console.log('此处打印',rs);
					// 更改内容
					that.wrap = rs.data.userinfo;
				})
			},
			// 获取内容
			getWrap() {
				// 上传数据
				var data = {
					table: 'goods_order',
					promote: true,
				};

				// 判断下标传参
				switch (that.current) {
					case 1:
						data.status = '4';
						break;
					case 2:
						data.status = '2,3';
						break;
					default:
						data.status = '2,3,4';
						break;
				}

				// 请求接口 
				that.request({
					url: '/api/index/index',
					// 上传数据
					data: data,
					load: 1,
					// 调用成功
					success(rs) {
						console.log('rs',rs);
						// 返回成功
						if (rs.code == 1) {
							// 赋值列表
							that.list = rs.data;
						} else {
							//弹窗提示用户
							that.alert(rs.msg);
						}
					},
					complete() {
						// 停止当前页面下拉刷新
						uni.stopPullDownRefresh();
					},
				})
			},

			// 切换显示的条件
			changeShow(i) {
				// 判断是否相等
				if (that.current == i) {
					return;
				}

				// 赋值下标
				that.current = i;

				// 获取内容
				that.getWrap();
			},
		},
	};
</script>
<style>

</style>
